<!-- 邮件管理下部分组件 -->
<template>
  <div class="emailbot">
    <div class="top">
      <reload-outlined />
    </div>
  <a-table :columns="columns" :data-source="data" :row-selection="rowSelection" />
</div>
</template>

<script lang="ts">
import { defineComponent, reactive, ref } from 'vue';
import axios from 'axios'
import {
  ReloadOutlined
} from '@ant-design/icons-vue';
const columns = [
  {
    title: '发件人',
    dataIndex: 'name',
    key: 'name',
  },
  {
    title: '收件人',
    dataIndex: 'age',
    key: 'age',
  },
  {
    title: '主题',
    dataIndex: 'address',
    key: 'age',
  },
  {
    title: '发送时间',
    dataIndex: 'address',
   
    key: 'address',
  },
  {
    title: '操作',
    dataIndex: 'address',
    key: 'address',
  },
];

interface DataItem {
  key: number;
  name: string;
  age: number;
  address: string;
  children?: DataItem[];
}

const data: DataItem[] = [
  // {
  //   key: 1,
  //   name: 'John Brown sr.',
  //   age: 60,
  //   address: 'New York No. 1 Lake Park',
  //   children: [
  //     {
  //       key: 11,
  //       name: 'John Brown',
  //       age: 42,
  //       address: 'New York No. 2 Lake Park',
  //     },
  //     {
  //       key: 12,
  //       name: 'John Brown jr.',
  //       age: 30,
  //       address: 'New York No. 3 Lake Park',
  //       children: [
  //         {
  //           key: 121,
  //           name: 'Jimmy Brown',
  //           age: 16,
  //           address: 'New York No. 3 Lake Park',
  //         },
  //       ],
  //     },
  //     {
  //       key: 13,
  //       name: 'Jim Green sr.',
  //       age: 72,
  //       address: 'London No. 1 Lake Park',
  //       children: [
  //         {
  //           key: 131,
  //           name: 'Jim Green',
  //           age: 42,
  //           address: 'London No. 2 Lake Park',
  //           children: [
  //             {
  //               key: 1311,
  //               name: 'Jim Green jr.',
  //               age: 25,
  //               address: 'London No. 3 Lake Park',
  //             },
  //             {
  //               key: 1312,
  //               name: 'Jimmy Green sr.',
  //               age: 18,
  //               address: 'London No. 4 Lake Park',
  //             },
  //           ],
  //         },
  //       ],
  //     },
  //   ],
  // },
  // {
  //   key: 2,
  //   name: 'Joe Black',
  //   age: 32,
  //   address: 'Sidney No. 1 Lake Park',
  // },
];

const rowSelection = ref({
  // checkStrictly: false,
  onChange: (selectedRowKeys: (string | number)[], selectedRows: DataItem[]) => {
    console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
  },
  onSelect: (record: DataItem, selected: boolean, selectedRows: DataItem[]) => {
    console.log(record, selected, selectedRows);
  },
  onSelectAll: (selected: boolean, selectedRows: DataItem[], changeRows: DataItem[]) => {
    console.log(selected, selectedRows, changeRows);
  },
});

export default defineComponent({
  components:{
    ReloadOutlined
  },
  setup() {
   
    return {
      data,
      columns,
      rowSelection,
    };
  },
});
</script>

<style>
.emailbot{
  width: 100%;
  height: 100%;
  margin: 30px 0px;
}
.top{
  width: 100%;
  height: 50px;
  margin: 0px 98%;
}
</style>